<template>
  <div class="setlease">
    <hunk-head name="填写租约"></hunk-head>
    <div class="leaseform">
      <uni-forms ref="form" :modelValue="formData" :rules="rules">
        <!-- <uni-forms-item label="房屋地址" name="address" :label-width="120" class="item1">
          <div class="address">{{houseinfo.newcontractid ? houseinfo.address : houseinfo.address+houseinfo.roomno}}</div>
        </uni-forms-item> -->
        <div class="housAdd">
            <div class="lable">房屋地址</div>
            <div class="address">{{houseinfo.newcontractid ? houseinfo.address : houseinfo.address+houseinfo.roomno}}</div>
          </div>
        <div style="height:10px;background:#F9F9F9;"></div>
        <!-- <uni-forms-item name="leasetype" label="租约方式" required :label-width="120">
          <uni-data-checkbox selectedColor="#FFBD6C" selectedTextColor="#4A4A4A" v-model="formData.leasetype" :localdata="leaseMode"/>
        </uni-forms-item> -->
        
        <uni-forms-item name="payrenttype" label="交租方式" required :label-width="120">
          <uni-data-checkbox selectedColor="#FFBD6C"  selectedTextColor="#4A4A4A" v-model="formData.payrenttype" :localdata="payMode"/>
        </uni-forms-item>

        <uni-forms-item name="isanonymous" label="是否匿名" required :label-width="120">
          <uni-data-checkbox selectedColor="#FFBD6C"  selectedTextColor="#4A4A4A" v-model="formData.isanonymous" :localdata="isanonymous"/>
        </uni-forms-item>

        <uni-forms-item label="租客姓名" name="tenantname" required :label-width="120">
          <uni-easyinput :disabled="formData.isanonymous" type="text" :inputBorder="false" v-model="formData.tenantname" placeholder="请输入租客姓名" />
        </uni-forms-item>

        <uni-forms-item label="身份证号码" name="cardid" required :label-width="120">
          <uni-easyinput :disabled="formData.isanonymous" type="text" :inputBorder="false" v-model="formData.cardid" placeholder="请输入租客身份证号码" />
        </uni-forms-item>

        <uni-forms-item label="租金（元/月）" name="rent" required :label-width="120">
          <uni-easyinput type="number" :inputBorder="false" v-model="formData.rent" placeholder="请输入租金金额" />
        </uni-forms-item>
        
        <uni-forms-item label="履约保证金（元/月）" name="mortgage" required :label-width="170">
          <uni-easyinput type="number" :inputBorder="false" v-model="formData.mortgage" placeholder="请输入最低押金" />
        </uni-forms-item>

        <uni-forms-item label="租约开始时间" name="starttime" required :label-width="120">
          <uni-datetime-picker
            type="date"
            :value="formData.starttime"
            :border="false"
            @change="checkStartTime"
          >
            <div v-if="formData.starttime">{{formData.starttime}}</div>
            <div class="timeimage" v-else>
              <div>请选择租约开始时间</div>
              <img class="icon" v-if="baseUrl" :src="baseUrl+'imgs/imgs/right.png'" alt="" srcset="">
            </div>
          </uni-datetime-picker>
        </uni-forms-item>

        <uni-forms-item label="租约结束时间" name="endtime" required :label-width="120">
          <uni-datetime-picker
            type="date"
            :value="formData.endtime"
            :border="false"
            @change="checkEndTime"
          >
            <div v-if="formData.endtime">{{formData.endtime}}</div>
            <div v-else>请选择租约结束时间<img class="icon" v-if="baseUrl" :src="baseUrl+'imgs/imgs/right.png'" alt="" srcset=""></div>
          </uni-datetime-picker>
        </uni-forms-item>
        <div style="height:10px;background:#F9F9F9;"></div>
        <uni-forms-item id="cycle" name="cycle"  label="交租周期" required :label-width="120" class="cycleItme swax">
            <uni-data-checkbox selectedColor="#FFBD6C" selectedTextColor="#4A4A4A" v-model="formData.cycle" :localdata="paycycle"/>
        </uni-forms-item>
      <div >

          <div class="cus" v-if="formData.cycle==5">
            <div class="custom-uni" v-for="(i,index) in checkbox1" :key="index">
              <div class="left">
                <uni-data-checkbox multiple selectedColor="#FFBD6C" selectedTextColor="#4A4A4A" v-model="i.check" :localdata="i.arr" />
              </div>
              <div class="right" >
                <uni-easyinput type="number" placeholder-style="font-weight: bolder;" :inputBorder="false" v-model="i.inputValue" placeholder="请输入金额" />
              </div>
            </div>

          </div>

            <uni-forms-item  v-if="formData.cycle==5" label="首次交租采用费率" name="firstrentpayment" required :label-width="150" class="cycleItme">
              <uni-data-checkbox selectedColor="#FFBD6C" selectedTextColor="#4A4A4A" v-model="formData.firstrentpayment" :localdata="paycycle2"/>
          </uni-forms-item>

       <div class="tips" v-if="nextTime">
         温馨提示：下次交租时间 {{nextTime}}
       </div>
          <uni-forms-item v-if="formData.cycle==5" label="首次交租时长" name="firstrentpaymentday" required :label-width="170">
            <uni-easyinput type="number" :inputBorder="false" v-model="formData.firstrentpaymentday" placeholder="请输入首次交租时长" />
          </uni-forms-item>

          <uni-forms-item v-if="formData.payrenttype==0" label="管理费率（%）" name="rate" required :label-width="170">
            <uni-easyinput  @input="inputRate2"  type="digit"  :min='0' :inputBorder="false" v-model="tenantRate" placeholder="请输入管理费率" @blur='leaveInput'/>
          </uni-forms-item>

          <uni-forms-item   label="电费（元/度）" name="electricityfees" required :label-width="170">
            <uni-easyinput type="digit"  :min='0' :inputBorder="false" v-model="formData.electricityfees" placeholder="请输入电费（元/度）" />
          </uni-forms-item>
          </div>
        <uni-forms-item label="提前交租时间(天)" required name="advancetime" :label-width="140">
          <uni-easyinput type="number" :inputBorder="false" v-model="formData.advancetime" placeholder="请填写需要提前交租的时间" />
        </uni-forms-item>
        
      </uni-forms>
       <div  style="height:10px;background:#F9F9F9;"></div>
       <div v-if="userInfo.enterpriseid" class="cotrant" @click="goContract">
            <div :style="{color:'#333','fontSize':'30rpx','fontWeight':800}">关联电子合同</div>
            <div :style="{color:formData.eid?'#0191FF':'#999','fontSize':'30rpx',fontWeight:'800'}">{{formData.code?formData.code:'请选择关联的电子合同'}}</div>
       </div>

      <div class="btn">
        <button :class="['subBtn',btnDisable?'hui':'']" :disabled="btnDisable" @click="submit">生成合同</button>
        <button class="backBtn" @click="goback">退出</button>
      </div>
    </div>
    <uni-popup ref="popup" type="center">
      <div class="popup1">
        <div class="con-head">
          分享好友
          <img @click="closePupop()" v-if="baseUrl" :src="baseUrl+'order/close.png'" alt="" srcset="">
        </div>
        <button class="btn1" open-type="share" @click="suerShare">确定</button>
        <div class="btn2 hui" @click="closePupop()">取消</div>
      </div>
    </uni-popup>
  </div>
</template>

<script>
import Head from '@componentsMine/head'
import { getContract,getDeptPayState,saveflexiblecontractV2,GetNextTime } from '@/apis/housesInfo'
import { throttle } from '@utils/index'
export default {
  components: {
    'hunk-head': Head
  },
  data() {
    return {
      maxlength: 10,
      tenantRate:'',
      tenantRate2:'',
      falg:{

      },
      // leaseMode: [{"value": 0,"text": "长租"    },{"value": 1,"text": "短租"}],
      payMode: [
        {"value": 0,"text": "线上交租",},
        {"value": 1,"text": "线下交租"}],
      paycycle: [
        {"value": 0,"text": "月付"},
        {"value": 1,"text": "两月付"},
        {"value": 2,"text": "季付"},
        {"value": 3,"text": "半年付"},
        {"value": 4,"text": "年付"},
      ],
      paycycle2:[
        {"value": 0,"text": "按日",key:'dailyrent'},
        {"value": 1,"text": "按周",key:'weeklyrent'},
        {"value": 2,"text": "按月",key:'monthlyrent'},
        {"value": 3,"text": "按季度",key:'quarterlyrent'},
      ],
      isanonymous: [
        {"value": 0,"text": "否"},
        {"value": 1,"text": "是"}
      ],
      checkbox1:[
        {
          arr:[{"value": 0,"text": "日付租金（元/日）"}],
          inputValue:'',
          key:'dailyrent',
          check:[]
        },
          {
          arr:[{"value": 0,"text": "周付租金（元/周）"}],
          inputValue:'',
          key:'weeklyrent',
          check:[]
        },
          {
          arr:[{"value": 0,"text": "月付租金（元/月）"}],
          inputValue:'',
          key:'monthlyrent',
          check:[]
        },
          {
          arr:[{"value": 0,"text": "季付租金（元/3个月）"}],
          inputValue:'',
          key:'quarterlyrent',
          check:[]
        }
      ],
 
      formData: {
        isanonymous:0,
        tenantname: '',
        leasetype: 1,
        payrenttype: 1,
        cardid: '',
        rent: null,
        mortgage: '',
        starttime: '',
        endtime: '',
        cycle: 2,
        advancetime: null,
        eid:'',
        code:'',
        firstrentpayment:0, //首次交租
        firstrentpaymentday:'', //首次交租时长
        rate:'', //管理费率
        electricityfees:'' //电费
      },
      rules: {
        tenantname: {
          rules: [
            {
              required: true,
              errorMessage: '请输入姓名',
            }
          ]
        },
        cardid: {
          rules: [
            {
              required: true,
              errorMessage: '请输入身份证',
            },
            {
              validateFunction: function(rule, value, data, callback) {
                // console.log(9999,value)
                let reg = /^(^\d{18}$|^\d{17}(\d|X|x))$/
                if(!reg.test(value)){
                  callback('请正确输入身份证')
                }
                return true
              }
            }
          ]
        },
        rent: {
          rules: [
            {
              required: true,
              errorMessage: '请输入租金',
            }
          ]
        },
        mortgage: {
          rules: [
            {
              required: true,
              errorMessage: '请输入最低保证金',
            }
          ]
        },
        starttime: {
          rules: [
            {
              required: true,
              errorMessage: '请输入开始时间',
            }
          ]
        },
        endtime: {
          rules: [
            {
              required: true,
              errorMessage: '请输入结束时间',
            }
          ]
        },
        advancetime: {
          rules: [
            {
              required: true,
              errorMessage: '请输入提前交租时间',
            }
          ]
        },
        firstrentpaymentday:{
          rules: [
            {
              required: true,
              errorMessage: '请输入首次交租时长',
            }
          ]
        },
        rate:{
          rules: [
            {
              required: true,
              errorMessage: '请输入管理费率',
            }
          ]
        },
         electricityfees:{
          rules: [
            {
              required: true,
              errorMessage: '请输入电费',
            }
          ]
        },
        advancetime:{
          rules: [
            {
              required: true,
              errorMessage: '请输入提前交租时间',
            }
          ]
        }
      },
      houseinfo:null,
      wid:'',
      newWid:'',
      detailInfo:'',
      btnDisable: false,
      nextTime:''
    }
  },
  onLoad(e){
    let newQuery = JSON.parse(e.query)
    this.houseinfo = newQuery
    console.log(9999,this.houseinfo)
    if(newQuery.newcontractid){
      this.getContract(newQuery.newcontractid)
    }
    this.judge()
    setInterval(()=>{
    },2000)
  },
  watch:{
    'formData.isanonymous'(news){
      if(+news===1){
        this.formData.tenantname = '匿名'
        this.formData.cardid = '111111191111111113'
      }else{
        this.formData.tenantname = ''
        this.formData.cardid = ''
      }
    },
    checkbox1:{
      deep:true,
      handler(news){
        console.log(news)
        let obj = {}
        news.filter(e=>e.check.length>0).forEach(el => {
          obj[el.key] = el.inputValue
        });
        this.paycycle2 = [
            {"value": 0,"text": "按日",key:'dailyrent'},
            {"value": 1,"text": "按周",key:'weeklyrent'},
            {"value": 2,"text": "按月",key:'monthlyrent'},
            {"value": 3,"text": "按季度",key:'quarterlyrent'},
        ]
        let arr = []
        for (const key in obj) {
          console.log({...this.paycycle2.filter(e=>e.key===key)[0]})
           arr.push({...this.paycycle2.filter(e=>e.key===key)[0]})
        }
        this.paycycle2 = arr
       
  // paycycle2:[
  //       {"value": 0,"text": "按日",key:'dailyrent'},
  //       {"value": 1,"text": "按周",key:'weeklyrent'},
  //       {"value": 2,"text": "按月",key:'monthlyrent'},
  //       {"value": 3,"text": "按季度",key:'quarterlyrent'},
  //     ],

      }
    },
    'formData.payrenttype'(news){
      if(+news===0){
      this.GetNextTime()
       this.paycycle =  [
        {"value": 0,"text": "月付"},
        {"value": 1,"text": "两月付"},
        {"value": 2,"text": "季付"},
        {"value": 3,"text": "半年付"},
        {"value": 4,"text": "年付"},
        {"value": 5,"text": "灵活交租" }
      ]
      }else{
         this.paycycle =  [
        {"value": 0,"text": "月付"},
        {"value": 1,"text": "两月付"},
        {"value": 2,"text": "季付"},
        {"value": 3,"text": "半年付"},
        {"value": 4,"text": "年付"},
      ]
      this.$set(this.formData,'cycle',2)
      }
    },
    'formData.starttime'(){
      this.GetNextTime()
    },
    'formData.firstrentpaymentday'(){
      this.GetNextTime()
    },
     'formData.advancetime'(){
      this.GetNextTime()
    },
    'formData.firstrentpayment'(){
      this.GetNextTime()
    },
  
  },
  computed:{
    userInfo(){
      return this.$store.state.baseStore.userInfo
    },
    baseUrl() {
      return process.env.VUE_APP_BASE_IMG_URL;
    }
  },
  onShow(){
    let selectedContract = this.$store.state.baseStore.selectedContract
    console.log(9999,this.$store.state.baseStore.selectedContract)
    let {code,eid} = selectedContract
    if(selectedContract){
      this.formData.code = code
      this.formData.eid = eid
    }
  },
  onShareAppMessage(resq) {
    let that = this
    if (resq.from === 'button') {
      // let data = {address:that.houseinfo.address,wid:that.wid}
      this.$refs.popup.close()
      // console.log(9999,'/pages/link/confirmlease?wid='+JSON.stringify(data))
      return {
        title: that.userInfo.unickname+'邀请您确认合同',
        // imageUrl: this.shareImg,
        // id=1&name=uniapp
        path: '/subPackage/link/confirmlease?wid='+that.wid
      }
    }
    
  },
  methods: {
    inputRate2(e){
        this.inputRate = e
    },
    leaveInput(){
      if(this.inputRate < this.tenantRate2){
        uni.showToast({
          title: '费率不能低于'+this.tenantRate2+'%',
          
        })
        this.tenantRate = this.tenantRate2
      }
    },
    GetNextTime(){
      const {starttime,firstrentpaymentday,advancetime,firstrentpayment,payrenttype} = this.formData
      if(starttime&&firstrentpaymentday&&advancetime&&(firstrentpayment==0||firstrentpayment==1||firstrentpayment==2||firstrentpayment==3)&&payrenttype==0){
        GetNextTime({
          Starttime:starttime,
          _firstrentpaymentday:firstrentpaymentday,
          advancetime,
          firstrentpayment}).then(e=>{
          console.log(e)
          this.nextTime = e.data.nextTime
        })
      }

    },
    checkNum(value) {
			let dot = value.indexOf('.');   //包含小数点
			let reg = /^[0-9]+$/;   //正整数
			if (dot > -1) {   
				this.maxlength = dot + 3;   //长度是小数点后两位
				if (value.length > dot + 3) {
				}
			}
			if (reg.test(value)) {   //如果是正整数不包含小数点
				this.maxlength = 10;
			}
		},
    /**
     * ○ 每次都需要判断是否有企业id，如果有企业ID，通过企业id 调用 “/house/manage/getDeptPayState” 
     * 来获取是否可以线上交租和费率信息，如果该企业没有线上交租，则线上交租选项不显示
     *○ 如果没有加入企业，单纯的公寓段，可以线上支付和线下支付，管理费率没有默认值。不能小于0
     * 
     * 
     */
    judge(){
      //是否是公寓端
      console.log(this.userInfo)
      if(+this.userInfo.usertype==1 || this.userInfo.usertype==3){
        //如果是企业
        if(this.userInfo.enterpriseid){
          getDeptPayState({enterpriseid:this.userInfo.enterpriseid}).then(res=>{
               if(res.code == 200){
                 console.log(res.data.tenantRate)
                 this.tenantRate = res.data.tenantRate
                 this.tenantRate2 =res.data.tenantRate
                 const {offlineFlag,onLineFlag,tenantRate} = res.data
                 this.falg = {
                   offlineFlag,
                   onLineFlag,
                   tenantRate
                 }
                 
                 this.payMode = []
                 if(+offlineFlag===0){
                   this.payMode.push({"value": 1,"text": "线下交租"})
                 }
                if(+onLineFlag===0){
                   this.payMode.push({"value": 0,"text": "线上交租"})
                 }
               }
          })
        }else{
          this.falg = {
            offlineFlag:0,
            onLineFlag:0,
            tenantRate:null
          }
          this.payMode= [{"value": 0,"text": "线上交租"},{"value": 1,"text": "线下交租"}]
        }
      }else{
        //● 业主端 
          this.falg = {
            offlineFlag:0,
            onLineFlag:0,
            tenantRate:null
          }
          //  this.payMode= [{"value": 0,"text": "线上交租"},{"value": 1,"text": "线下交租"}]
          this.payMode= [{"value": 1,"text": "线下交租"}]
      }
    },
    closePupop(){
      this.$refs.popup.close()
    },
    checkStartTime(e){
      this.formData.starttime = e
    },
    checkEndTime(e){
      let d1 = new Date(this.formData.starttime)
      let t1 = d1.valueOf(d1)
      let d2 = new Date(e)
      let t2 = d2.valueOf(d2)
      if(t2>t1){
        this.formData.endtime = e
      }else{
        uni.showToast({
          title: '结束时间要在开始时间以后',
          icon: 'error'
        })
      }
      
    },
    submit() {
      let that = this
      let obj = {}
      this.checkbox1.filter(e=>e.check.length>0).forEach(el => {
        obj[el.key] = el.inputValue
      });
      // if(map.length<=0){
      //    uni.showToast({
      //         title: "按日交租租金不能小于“最低租金”/30",
      //         icon: 'none'
      //       })
      //       return
      // }
      
      
      console.log(obj)
      this.$refs.form.setRules(this.rules)
      this.$refs.form.validate().then(res=>{
        console.log('res',res)
        
        /***
         * 点击提交  针对灵活交租 要校验 “按日交租租金不能小于“最低租金”/30，
         * 按周交租租金不能小于“最低租金”/4.2，按月交租租金不能小于“最低月租金”，
         * 按季交租租金不能小于“最低月租金”*3”，没问题 生成合同
         */
        if(+this.formData.cycle ===5){
          console.log(obj)
          if(JSON.stringify(obj)=='{}'){
            uni.showToast({
              title: "灵活交租至少选择一个交租方式",
              icon: 'none'
            })
            return
          }
          for (const key in obj) {
            if(!obj[key]){
               uni.showToast({
                title: "灵活交租选择的交租方式值不能为空",
                icon: 'none'
              })
              return
            }
          }
          
          console.log(parseInt(this.houseinfo.lowrent)/30)
          if(obj.dailyrent && (parseInt(this.houseinfo.lowrent)/30 > parseInt(obj.dailyrent))){
            uni.showToast({
              title: "按日交租租金不能小于“最低租金”/30",
              icon: 'none'
            })
            return
          }
           if(obj.weeklyrent && (parseInt(this.houseinfo.lowrent)/4.2 > parseInt(obj.weeklyrent))){
            uni.showToast({
              title: '按周交租租金不能小于“最低租金”/4.2',
              icon: 'none'
            })
            return
          }
          if(obj.monthlyrent && (parseInt(this.houseinfo.lowrent) > parseInt(obj.monthlyrent))){
            uni.showToast({
              title: '按月交租租金不能小于“最低月租金”',
              icon: 'none'
            })
            return
          }
          if(obj.quarterlyrent && (parseInt(this.houseinfo.lowrent)*3  > parseInt(obj.quarterlyrent))){
            uni.showToast({
              title: '按季交租租金不能小于“最低月租金”*3',
              icon: 'none'
            })
            return
          }
        }else{
          if( parseInt(this.houseinfo.lowrent) > parseInt(this.formData.rent)){
            uni.showToast({
              title: '租金不能低于最低月租金！',
              icon: 'none'
            })
            return
          }
        }



        res.createuserid = that.userInfo.userid
        res.houseid = that.houseinfo.houseid
        res.houseroomid = that.houseinfo.houseroomid
        res.leasetype = 1
        res.wid = 0
        if(obj.dailyrent){
          res.dailyrent = obj.dailyrent
        }
        if(obj.weeklyrent){
          res.weeklyrent = obj.weeklyrent
        }
        if(obj.monthlyrent){
          res.monthlyrent = obj.monthlyrent
        }
        if(obj.quarterlyrent){
          res.quarterlyrent = obj.quarterlyrent
        }
        throttle(that.addContract(res),1000)
        
      }).catch(err =>{
        console.log('表单错误信息：', err);
      })
    },
    suerShare(){
   let that = this
    that.btnDisable = true
    },
    addContract(res){
      let that = this
      console.log(res)
        if(this.formData.eid)
        res.eid = this.formData.eid
      if(that.wid ==''){
        saveflexiblecontractV2(res).then(res =>{
          if(res.code == 200){
            that.wid = res.data.wid
            // that.btnDisable = true
            that.$refs.popup.open()
          }else{
            uni.showToast({
              title: res.msg,
              // icon: 'error'
              icon:'none'
            })
          }
        })
      }else{
        that.$refs.popup.open()
      }
     
    },
    goback(){
      // 邀请返回首页
      uni.redirectTo({ url: '/pages/index/index' })
      // uni.navigateBack({ delta: 1 })
    },
    goContract(){
      uni.navigateTo({ url: '/subPackage/manage/commponents/contract/index?state=1' })
    },
    getContract(wid){
      let that = this
      getContract({wid: wid}).then(res=>{
        if( res.code == 200 ){
          that.$nextTick(()=>{
            that.houseinfo.address = res.data.address
            let arr = res.data.endtime.split(' ')
            that.formData.starttime = arr[0]
            that.formData.tenantname = res.data.tenantname
            that.formData.leasetype = res.data.leasetype
            that.formData.payrenttype = res.data.payrenttype
            that.formData.cardid = res.data.cardid
            that.formData.rent = res.data.rent
            that.formData.mortgage = res.data.mortgage
            that.formData.cycle = res.data.cycle
            that.$forceUpdate()
          })
        }else{
          uni.showToast({
            title: res.msg,
            icon: 'none'
          })
        }
      })
    }
  }
}
</script>

<style lang="scss" scoped>
.setlease {
  width: 100vw;
  box-sizing: border-box;
  height: 100vh;
  background: #F9F9F9;
  display: flex;
  flex-direction: column;
  .leaseform{
    flex: 1;
    overflow-y: auto;
    .btn{
      display: flex;
      flex-direction: column;
      justify-items: center;
      align-items: center;
      font-size: 16px;
      font-family: PingFangSC-Semibold, PingFang SC;
      font-weight: 600;
      line-height: 45px;
      padding-bottom: 40px;
      .subBtn{
        margin-top: 16px;
        width: 345px;
        height: 45px;
        background: linear-gradient(315deg, #FFAA58 0%, #FFBD6C 100%);
        box-shadow: 0px 2px 4px 0px rgba(252, 174, 55, 0.21), 0px 3px 5px 0px rgba(255, 216, 111, 0.14);
        border-radius: 100px;
        text-shadow: 0px 2px 4px rgba(252, 174, 55, 0.21);
        color: #FFFFFF;
        text-align: center;
      }
      .backBtn{
        margin-top: 10px;
        width: 345px;
        height: 45px;
        border-radius: 100px;
        border: 1px solid #FFBD6C;
        color: #FFAA58;
      }
      .hui{
        background: rgba(130, 130, 130, 0.2);
        box-shadow:none
      }
      button::after{
        border: 0;
      }
    }
    
  }
  .popup1{
  width: 335px;
  height: 212px;
  background: #FFFFFF;
  display: flex;
  flex-direction: column;
  align-items: center;
  border-radius: 10px;
  .con-head{
    width: 100%;
    font-size: 18px;
    font-family: PingFangSC-Medium, PingFang SC;
    font-weight: 500;
    color: #4A4A4A;
    line-height: 25px;
    position: relative;
    box-sizing: border-box;
    padding: 18px 0;
    text-align: center;
    border-bottom: 1px solid #EFEFEF;
    img{
      position: absolute;
      right: 15px;
      width: 18px;
      height: 18px;
    }
  }
  .btn1{
    margin-top: 20px;
    width: 305px;
    height: 45px;
    background: linear-gradient(315deg, #FFAA58 0%, #FFBD6C 100%);
    border-radius: 100px;
    font-size: 16px;
    font-family: PingFangSC-Medium, PingFang SC;
    font-weight: 500;
    color: #FFFFFF;
    line-height: 45px;
    text-align: center;
  }
  .btn2{
    margin-top: 20px;
    width: 305px;
    height: 45px;
    // background: linear-gradient(140deg, #FFCF58 0%, #FFD758 100%);
    background: rgba(130, 130, 130, 0.2);
    border-radius: 100px;
    font-size: 16px;
    font-family: PingFangSC-Medium, PingFang SC;
    font-weight: 500;
    color: #FFFFFF;
    line-height: 45px;
    text-align: center;
  }
  button::after{
    border: 0;
  }
}
}
::v-deep .uni-forms{
  background: #FFFFFF;
  .uni-forms-item{
    // height: 45px;
    margin: 0 15px;
    background: #FFFFFF;
    border-bottom: 1px solid #EFEFEF;
    .uni-forms-item__box{
      .uni-error-message{
        right: 0;
        left: auto;
        .uni-error-message-text{
          line-height: 10px;
          font-size: 10px;
        }
      }
      .uni-forms-item__inner{
        margin: 0;
        padding: 0;
      }
    }
    
    .uni-forms-item__label{
      padding: 0;
      height: 45px;
      .label-text{
        font-size: 15px;
        font-family: PingFangSC-Medium, PingFang SC;
        font-weight: 500;
        color: #000000;
        line-height: 21px;
      }
    }
    .uni-forms-item__content{
      height: 45px;
      text-align: right;
      .uni-data-checklist{
        margin-bottom: 6px;
        height: 33px;
        .checklist-group{
          height: 100%;
          justify-content: flex-end;
          font-size: 14px;
          font-family: PingFangSC-Medium, PingFang SC;
          font-weight: 500;
          color: #4A4A4A;
          line-height: 35px;
          .checklist-box{
            position: static;
            margin: 0;
            margin-right: 20rpx;
            margin-bottom: 11px !important;
            margin-top: -2.5px !important;
          }
          .checklist-box:last-child{
            margin-right: 0;
          }
        }
      }
      .uni-easyinput{
        .uni-easyinput__content{
          .uni-easyinput__content-input{
            height: 45px;
            text-align: right;
            font-size: 14px;
            font-family: PingFangSC-Medium, PingFang SC;
            font-weight: 500;
            line-height: 45px;
            color: #4A4A4A;
            .uni-easyinput__placeholder-class{
              font-size: 14px;
              font-family: PingFangSC-Medium, PingFang SC;
              font-weight: 500;
              line-height: 45px;
              color: #9B9B9B;
              
            }
          }
        }
      }
      .uni-date{
        .uni-date-editor{
          div{
            font-size: 14px;
            font-family: PingFangSC-Medium, PingFang SC;
            font-weight: 500;
            color: #9B9B9B;
            line-height: 45px;
            display: flex;
            flex-direction: row;
            align-items: center;
            text-align: right;
            justify-content: flex-end;
            img{
              margin-left: 10px;
              width: 9px;
              height: 15px;
            }
          }
        }
      }
      .address{
        height: 45px;
        font-size: 14px;
        font-family: PingFangSC-Medium, PingFang SC;
        font-weight: 500;
        color: #4A4A4A;
        line-height: 45px;
      }
    }
  }
  .uni-forms-item:last-child{
    border: 0;
  }
  .housAdd{
    display: flex;
    justify-content: space-between;
    padding: 12px 15px;
    .lable{
      width: 150px;
      height: 21px;
      font-size: 15px;
      font-family: PingFangSC-Medium, PingFang SC;
      font-weight: 500;
      color: #000000;
      line-height: 21px;
    }
    .address{
      font-size: 14px;
      font-family: PingFangSC-Medium, PingFang SC;
      font-weight: 500;
      color: #4A4A4A;
      line-height: 20px;
    }
  }
  .item1{
    border: 0;
  }
  .swax.cycleItme{
    .is-direction-left{
       .uni-forms-item__content{
         .checklist-group{
           .checklist-box:last-child{
            // margin-top: 8px;
          }
         }
       }
    }
  }
  .cycleItme{
    height: auto;
   
    .is-direction-left{
      flex-direction: column;
      .uni-forms-item__label{
        height: auto;
        margin-top: 13px;
      }
      .uni-forms-item__content{
        height: auto;
        .checklist-group{
          display: flex!important;
          flex-direction:row;
          flex-wrap: wrap;
          justify-content:flex-start!important;
           .checklist-box:last-child{
            // margin-top: 8px;
          }
        }
      }
    }
  }
}
 
.cotrant{
  display:flex; justify-content: space-between;background:#fff;padding: 20rpx 30rpx;width:100%
}
.cus{
  margin-top: 10px;
}
.custom-uni{
  display: flex;
  line-height: 43px;
  height: 43px;
  padding:0 15px;
  border-top: 1px solid #EFEFEF;
  justify-content: space-between;
  align-items: center;
  .left{
    width: 300px;
    ::v-deep .checklist-content{
      color:#000000;
      font-weight: 500;
      font-size: 400rpx;
      font-family: PingFangSC-Medium, PingFang SC;
    }
  }
  .right{
    ::v-deep input{
      text-align: right;
      font-weight: bolder;
      color: #000000;
    }
  }
}
#cycle ::v-deep .checklist-box:last-child{
  // margin-top: 8px;
}
.tips{
  color: #F04945;
  line-height: 37px;
  margin-left: 15px;
  background: #F9F9F9;
}
</style>
